<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="/common/meta.jsp"%>
<script type="text/javascript" src="${ctx}/js/utils/swfupload/swfupload.js"></script>
<title>汪星客 - 个人中心 - 店铺信息管理</title>
</head>
<body>
	<div class="wrap">
		<div class="header_bg">
			<%@ include file="/common/header.jsp"%>
	    </div>
	    <div class="w">
	    	<div class="path box">
	    		<jsp:include page="/common/frame/frame_path.jsp">
            		<jsp:param name="current" value="个人信息"/>
            	</jsp:include>
	        </div>
	    </div>
	    <div class="main">
		    <div class="list box">
	        	<div class="pc_left">
	            	<jsp:include page="/common/frame/frame_left.jsp">
	            		<jsp:param name="checked" value="info"/>
	            	</jsp:include>
	            </div>
	            <div class="pc_right">
	            	<form id="frame_info_form" method="post" action="${ctx}/user/saveinfo.do">
	    			 <div class="pc_m fl">
	                	<div class="mydog2 fl">
	                		<div class="info">
								<p class="font_s">昵称</p>
								<input class="easyui-validatebox ipt_txt" name="user.userNickName" data-options="required:true, prompt:'请填写昵称。'"/>
							</div>
							<div class="info">
								<p class="font_s">真实姓名</p>
								<input class="easyui-validatebox ipt_txt" name="user.userName" data-options="prompt:'请填写真实姓名。'"/>
							</div>
							<div class="info">
								<p class="font_s">性别</p>
								<select name="user.userSex" class="easyui-combobox" data-options="panelHeight:65">  
								    <option value="0" selected="selected">保密</option>  
								    <option value="1">男</option>  
								    <option value="2">女</option>  
								</select>
							</div>
							<div class="info">
								<p class="font_s" >移动电话</p>
								<input class="easyui-validatebox ipt_txt" maxlength="11" name="user.userTel" data-options="prompt:'请填写您的移动电话号码。', validType:['mobile']"/>
							</div>
							<div class="info">
								<p class="font_s">电子邮箱</p>
								<input class="easyui-validatebox ipt_txt" name="user.userEmail" data-options="required:true, prompt:'请填写常用电子邮箱。', validType:['email', 'length[5,50]']"/>
							</div>
							<div class="info">
								<p class="font_s">出生日期</p>
								<input id="userBirthday" type="text" name="user.userBirthday" data-options="pWidth:10" style="width:300px;height:30px;font-size:20px;line-height:25px;"/>
							</div>
							<div class="info">
								<p class="font_s">身份证号</p>
								<input class="easyui-validatebox ipt_txt" maxlength="18" name="user.userCard" data-options="prompt:'请填写您的有效身份证号码。', validType:['IDCard']"/>
							</div>
	                    </div>
	                    <div class="mydog2_r">
	                    	<div>
								<input type="hidden" name="user.userPhotoPath"/>
								<img id="frame_info_head_img" class="myphoto" style="width:120px;height:120px;" src="${ctx}/images/user_no_head.jpg" />
							</div>
							<div id="frame_info_head_progressbar" class="easyui-progressbar" style="width:120px;display: none;"></div>
	                        <div style="width:120px;padding: 1px;text-align: center;">
								<span id="frame_info_head_uploadbutton"></span>
							</div>
	                    </div>
	                    <div class="btn">
	                    	<a href="#" onclick="submitUserInfo(this)" class="easyui-linkbutton tg-btn">提交</a>
	                    </div>
	                </div>
	                </form>
            	</div>
	    		<div class="clear"></div>
			</div>
	    </div>
	    <div class="footer_bg">
	    	<%@ include file="/common/footer.jsp"%>
	    </div>
	</div>
</body>
<script type="text/javascript">
$("#frame_info_head_img").error(function(){
	$(this).attr("src", "${ctx}/images/user_no_head.jpg");
});

$("[name='user.userBirthday']").datebox({});

$('#frame_info_form').form({
	onLoadSuccess:function(user) {
		frame.onLoadForm(this, "user", user);
		if(user.userPhotoPath != null && user.userPhotoPath != "") {
			$("#frame_info_head_img").attr("src", "${ctx}/tools/download.do?dir=HEAD&fileName=" + user.userPhotoPath);
		}
		$("input[name='user.userPhotoPath']").val("");
	}
}).form('load', "${ctx}/user/get.do");


function submitUserInfo(buttonObj) {
	frame.submitForm("frame_info_form", buttonObj, function(res) {
        if (res.code == 1) {
        	msg.msg("用户信息保存成功.");
        } else {
        	msg.err(res.msg);
        }
    });
}
//=============上传组件=================
//文件上传处理函数
var swfupload_img = {};
//文件选择成功
swfupload_img.fileQueuedHandler = function(){
	//禁用按钮
	this.setButtonDisabled(true);
	//开始上传
	this.startUpload();
	//显示上传进度条
	$('#frame_info_head_progressbar').progressbar('setValue', 0).show();
};
//文件选择错误.
swfupload_img.fileQueueErrorHandler = function() {
	msg.error("文件选择出错! 可能超出文件最大限制.");
};
//上传过程
swfupload_img.uploadProgressHandler = function(file, complete, bytes) {
	$('#frame_info_head_progressbar').progressbar('setValue', parseInt((complete/bytes) * 100));
};
//上传成功
swfupload_img.uploadSuccessHandler = function(file, data) {
	//将字符串转换为json
	var retObj = tools.s2j(data);
	if(retObj.code==1){
		$("input[name='user.userPhotoPath']").val(retObj.attributes.fileName);
		$("#frame_info_head_img").attr("src", "${ctx}/tools/download.do?dir=TEMP&fileName=" + retObj.attributes.fileName);
	} else {
		msg.error(retObj.msg);
	}
	//启用按钮
	this.setButtonDisabled(false);
	$('#frame_info_head_progressbar').hide();
};
//
swfupload_img.uploadErrorHandler = function(msg) {
	tools.error("文件上传出错,可能为登录超时.");
	//启用按钮
	this.setButtonDisabled(false);
	$('#frame_info_head_progressbar').hide();
};

swfUploadInitAttach();	
var swfu_attach;
function swfUploadInitAttach() {
	var swfUploadSetting = {
		upload_url: "${ctx}/tools/upload.do",				//提交路径
		flash_url : "${ctx}/js/utils/swfupload/swfupload.swf",	//控件路径
		//use_query_string:true,//post_params以GET方式上传
		// File Upload Settings
		file_size_limit : "${fileSize} KB",	// 文件大小 B,KB,MB,GB
		file_types : "*.JPG;*.GIF;*.PNG",		//设置文件类型
		file_types_description : "Image",//显示在文件选择框的打开文件类型
		//file_upload_limit : 1,//允许上传文件数量
		button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,//允许HTML在它下面显示
		button_cursor: SWFUpload.CURSOR.HAND,
		button_action:SWFUpload.BUTTON_ACTION.SELECT_FILE,	//设置点击按钮打开单一文件选择对话框
		
		button_image_url : "${ctx}/images/swfupload_upload_photo.gif",
		button_placeholder_id: "frame_info_head_uploadbutton",
		button_width: "78",
		button_height: "26",
		button_text : '上传头像',
//			button_text_style : '.button {color:#000;text-align: right;}',
		button_text_left_padding: 23,
		button_text_top_padding: 3,
		
		upload_success_handler:swfupload_img.uploadSuccessHandler,		//获取上传后返回信息
		upload_progress_handler:swfupload_img.uploadProgressHandler,	//设置上传时的状态信息
		upload_error_handler:swfupload_img.uploadErrorHandler,			//发生错误的回调函数
		file_queued_handler:swfupload_img.fileQueuedHandler,			//选择文件成功之后调用
		file_queue_error_handler:swfupload_img.fileQueueErrorHandler,					//选择文件错误之后调用
		// Debug Settings
		debug: false		//是否开启Degug信息
	};
	swfu_attach = new SWFUpload(swfUploadSetting);
}
</script>
</html>